<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<?xml version="1.0" encoding="UTF-8"?>
<html>
<head>
    <link rel="stylesheet" href="style.css" type="text/css" />
    <script type="text/javascript" src="../js/mapstraction.js"></script>
    <script type="text/javascript" src="../js/prototype.js"></script>
    <!--[if IE]>
        <script type="text/javascript" src="../js/excanvas.js"></script>
        <script type="text/javascript" src="../js/base64.js"></script>
    <![endif]-->
    <script type="text/javascript" src="../js/canvastext.js"></script>
    <script type="text/javascript" src="../js/flotr-0.2.0-alpha.js"></script>
    <script type="text/javascript" src="../js/ObjTree.js"></script>
    <script type="text/javascript" src="../js/tools4gps.js"></script>
</head>

<body>

<div id="profile" style="width:580px; height:260px;"></div>

<script type="text/javascript">
    var parser = new GPS.Parser("gpsdata/090110-MarchaDelMetra.gpx");
    parser.run(function (gpsData) {
        var chart = new GPS.Profile("profile", gpsData, {
            x: 'dist',             // Property to be used in the x axis. Admited
                                   // values are 'dist', 'dist3d' or 'hour'.
            y: 'elev',             // Property to be used in the y axis. Admited
                                   // values are 'elev', 'vel', 'vel3d' or 'heartRate'.
            colors: ['red', '#ffbb00'],  // The first color is the default for distance 
                                   // profiles, the second for time profiles.
            join: true,            // If true, join the diferent segments and tracks.
            trackingEnabled: true, // If true, shows x-y values in one corner of the chart.
            zoomEnabled: true,     // If true, enable mouse selection and zoom.
            xFactor: 1000,         // Values are multiplied by this factor for unit conversion.
            yFactor: null,         // If null, i18n factors will be used (see localization).
            xDecs: 0,              // Number of fixed decimals for x/y values in the track box.
            yDecs: null,           // If null, i18n values will be used (see localization).
            xUnit: 'm',            // Put a string to show in X/Y axis ticks units.
            yUnit: null,           // If null, i18n units will be used (see localization).
            minDeltaX: 0.05,       // Filter to draw points in the x axis.
            wpt: {                 // False to hide waypoints, else...
                color: '#cc4400',      // Primary color used for outline.
                points: {
                    radius: 4,             // Point radius (pixels).
                    lineWidth: 2,          // Line width in pixels.
                    fill: true,            // True to fill the points with a color.
                    fillColor: '#aa0000'   // Fill color.
                }
            },
            trk: {                 // False to hide tracks, else...
                color: '#aa4400',      // Primary color used for tracks
                lines: {
                    lineWidth: 1,      // Line width in pixels
                    fill: true,        // True to fill the area from the line to 
                                       // the x axis, false for (transparent) no fill
                    fillOpacity: 0.6   // Opacity of the fill color, (1 solid)
                }
            },
            rte: false,            // False to hide routes, else similar to trk.
            grid: {
                color: '#666644',      // Primary color used for outline and labels.
                backgroundColor:'#eec',// Null for transparent, else color.
                tickColor: '#dddd99',  // Color used for the ticks.
                labelMargin: 3         // Margin in pixels.
            },
            xaxis: {               // You can use this both in xaxis and yaxis.
                min: 10000,               // Min. value to show, null means set automatically.
                max: 30000                // Max. value to show, null means set automatically.
            },
            yaxis: {               // You can use this both in xaxis and yaxis.
                noTicks: 8,            // Number of ticks for automagically generated ticks.
                tickFormatter: function(n) {    
                    return n + ' m'        // function: number -> string
                }, 
                tickDecimals: null,    // No. of decimals, null means auto.
                autoscaleMargin: 0.2   // Margin in % to add if auto-setting min/max.
            },
            selection: {
                mode: 'xy',            // One of null, 'x', 'y' or 'xy'.
                color: '#ffB6D9',      // Selection box color.
                fps: 10                // Frames-per-second.
            },
            mouse: {
                position: 'ne',        // Position of the value box (default south-east).
                trackFormatter: function(obj) {  // Formats the values in the value box.
                    return '(' + obj.x + ', ' + obj.y + ')'
                }, 
                margin: 6,             // Margin in pixels of the valuebox.
                lineColor: 'red',      // Line color of points that are drawn when 
                                       // mouse comes near a value of a series.
                trackDecimals: 1,      // Decimals for the track values.
                sensibility: 400,      // The lower this number, the more precise
                                       // you have to aim to show a value.
                radius: 4              // Radius of the track point.
            },
            shadowSize: 2          // Size of the 'fake' shadow.
        });
    });    
</script>

</body>
</html>